<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich" >

	<ui:composition template="/templates/gerenciamento.xhtml" >
		<ui:define name="js">
			<h:outputScript library="js" name="jquery.maskedinput-1.2.2.min.js" target="body" />
			<h:outputScript library="js" name="jquery.maskMoney.min.js" target="body" />
		</ui:define>
		<ui:define name="css">
			<link rel="stylesheet" type="text/css" href="style/folha_gerenciamento.css" media="screen" />
			<link rel="stylesheet" type="text/css" href="style/logado.css" media="screen" />
			<link rel="stylesheet" type="text/css" href="style/styles.css" media="screen" />
			<style type="text/css">
			body {
				margin-left: 0px;
				margin-top: 0px;
				margin-right: 0px;
				margin-bottom: 0px;
			}
			</style>
		</ui:define>
		<ui:define name="mid">
			<h:form id="formvalue">
			
				<a4j:status onstart="#{rich:component('statPane')}.show()" onstop="#{rich:component('statPane')}.hide()" /> 
				<rich:popupPanel id="statPane" autosized="true"> 
					<h:outputText value="Aguarde..." styleClass="output-style"/> 
				</rich:popupPanel>
			
				<div id='cssmenu'>
					<ul>
						
						<li>
							<a4j:commandLink action="#{logadoBean.goGerenciamentoMeuUsaCardHistorico}">
								<span>HISTÓRICO</span>
							</a4j:commandLink>	
						</li>
				
						<li class='active'>
							<a4j:commandLink>
								<span>RECARREGUE SEU CARTÃO</span>
							</a4j:commandLink>
						</li>
						<li>
							<a4j:commandLink action="#{logadoBean.goGerenciamentoMeuUsaCardGerencieSeuCartao}" >
								<span>GERENCIE SEU CARTÃO</span>
							</a4j:commandLink>
						</li>
						<li>
							<a4j:commandLink action="#{logadoBean.goGerenciamentoEditarPerfil}">
								<span>PERFIL</span>
							</a4j:commandLink>
						</li>
					</ul>
				</div>
				<div class="inside_extrato">
				
					<div class="inside_D">
				   	  <div class="inside_D1"><img src="images/boleto.jpg" width="327" height="315" /></div>
				      <div class="inserir_valor">
				      	<div class="inserirvalor"><strong>Inserir valor R$</strong></div>
				      	<div class="inserir_valor_campo2">
				      	  <label for="textfield"></label>
				      	  <h:inputText id="valorBoleto" value="#{recarregueBean.valor}" style="width:150px" >
				      	  	 <f:convertNumber locale="pt-BR" maxFractionDigits="2" minFractionDigits="2" />
				      	  </h:inputText>
				      	  <rich:jQuery selector="#formvalue\:valorBoleto" query="maskMoney({symbol:'R$ ', showSymbol:true, thousands:'.', decimal:',', symbolStay: true})" timing="domready" />
				      	</div>
				      	<div class="inserir_valor_botao" id="link3_" align="center">
				        	<h:commandButton value="Gerar Arquivo" action="#{recarregueBean.gerarBoleto}" />
				        </div>
				      </div>
					</div>
				
				</div>
			

			</h:form>
		</ui:define>
	</ui:composition>

</html>